<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" isELIgnored="false" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fmtutc" uri="/tags/utcdate" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1" />
    <meta charset="utf-8">
    <title><spring:message code="company" text="Hang Zhou ykhl Technology Co."/></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="ykhl,iSP">
    <meta name="author" content="ykhl">

    <!-- The styles -->
    <link id="bs-css" href='<c:url value='/resources/charisma-master/css/bootstrap-cerulean.min.css '/>'
          rel="stylesheet">
    <%--     <link id="bs-css" href='<c:url value='/resources/charisma-master/css/bootstrap-cerulean.min.css '/>' rel="stylesheet"> --%>

    <link href='<c:url value='/resources/charisma-master/css/charisma-app.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/bower_components/fullcalendar/dist/fullcalendar.css '/>'
          rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/bower_components/fullcalendar/dist/fullcalendar.print.css '/>'
          rel="stylesheet" media="print">
    <link href='<c:url value='/resources/charisma-master/bower_components/chosen/chosen.min.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/bower_components/colorbox/example3/colorbox.css '/>'
          rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/bower_components/responsive-tables/responsive-tables.css '/>'
          rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/bower_components/bootstrap-tour/build/css/bootstrap-tour.min.css '/>'
          rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/bower_components/bootstrap-datepicker-release/css/datepicker3.css '/>'
          rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/jquery.noty.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/noty_theme_default.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/elfinder.min.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/elfinder.theme.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/jquery.iphone.toggle.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/uploadify.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/charisma-master/css/animate.min.css '/>' rel="stylesheet">
    <link href='<c:url value='/resources/css/sluan.css '/>' rel="stylesheet">


    <!-- The HTML5 shim, for IE6-8 support of HTML5 elements -->
    <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js '></script>
    <![endif]-->

    <!-- The fav icon -->
    <%@include file="../../common/commonhead.jsp" %>

</head>

<body>

<%@include file="../../common/common.jsp" %>
<%@include file="../../header.jsp" %>

<div class="container-fluid mycontainer">

    <%@include file="../../nav.jsp" %>

    <div class="rightbox_content">
        <!-- content starts -->
        <div class="breadcrumbdiv">
            <ul class="breadcrumb">
                <li>
                    <a href="<c:url value="/index" />"><spring:message code="breadcrumb.home" text="Home"/></a>
                </li>
                <li>
                    <spring:message code="nav.menu.blacklist" text="Blacklist"/><spring:message
                        code="nav.menu.manage" text="Manage"/>
                </li>
            </ul>
        </div>

        <div class="">
            <div class="box col-md-12">
                <div class="box-inner">
                    <div class="box-header well" data-original-title="">
                        <h2><i class="glyphicon glyphicon-hdd"></i>
                            <spring:message code="nav.menu.blacklist" text="Blacklist"/><spring:message
                                    code="nav.menu.manage" text="Manage"/>
                        </h2>
                    </div>
                    <div class="box-content">
                        <div class="navbar-inner">
                            <%--<ul id="myTab" class="nav nav-tabs">
                                <li class="active"><a href="#rightLog" data-toggle="tab">访问列表</a></li>
                                <li><a id="blacktab" href="#blacklist" data-toggle="tab">黑名单列表</a></li>
                            </ul>--%>
                            <%--<div id="myTabContent" class="tab-content">--%>
                            <%--<div class="tab-pane fade in active" id="rightLog">
                                <div class="navbar-inner">
                                    <c:url value="/json/blackList/showWhite" var="searchActoin">
                                        <c:param name="typeId" value="${typeId }"/>
                                    </c:url>
                                    <form:form onsubmit="return checkcondition();" id="whiteForm"
                                               modelAttribute="searchForm" action="${searchActoin}">
                                        <form:hidden path="orderByClause"/>
                                        <form:hidden path="page" value="1"/>
                                        <form:hidden path="size" value="5"/>
                                        <spring:message code="placeholder.start" text="Start"
                                                        var="placeholder_start"/>
                                        <spring:message code="placeholder.to" text="To"
                                                        var="placeholder_to"/>
                                        <spring:message code="placeholder.end" text="End"
                                                        var="placeholder_end"/>
                                        <spring:message code="placeholder.keyword.name" text="Keyword"
                                                        var="placeholder_keyword_name"/>
                                        <spring:message code="placeholder.search" text="Search"
                                                        var="placeholder_search"/>
                                        <div class="navbar-form navbar-right" role="search">
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <form:input class="form-control"
                                                                placeholder="${placeholder_keyword_name}"
                                                                path="key"/>
                                                        <span class="input-group-btn">
                                                          <button type="submit" class="btn btn-info"><i
                                                                  class="glyphicon glyphicon-search"></i>
                                                          </button>
                                                        </span>
                                                </div>
                                            </div>
                                        </div>
                                    </form:form>
                                    <div id="wrapper">
                                        <c:set var="page" value="${blacklists.getPage() }"></c:set>
                                        <div class="table-content">
                                            <table class="table table-striped table-bordered responsive">
                                                <thead>
                                                <tr>
                                                    <th id="th_appname" title="appName"><spring:message
                                                            code="model.blacklist.appname"
                                                            text="appName"/></th>
                                                    <th id="th_username" title="username"><spring:message
                                                            code="model.blacklist.username"
                                                            text="username"/></th>
                                                    <th id="th_activenum" title="activenum"><spring:message
                                                            code="model.blacklist.activenum"
                                                            text="activenum"/></th>
                                                    <th id="th_code" title="Code"><spring:message
                                                            code="model.blacklist.code" text="Code"/></th>
                                                    <th title="Actions" class="actions w90"><spring:message
                                                            code="actions" text="Actions"/></th>
                                                </tr>
                                                </thead>
                                                <tbody>
                                                <c:forEach var="black" items="${page.items }">
                                                    <tr>
                                                        <td id="${black.appid}">${black.appName}</td>
                                                        <td>${black.userName}</td>
                                                        <td></td>
                                                        <td>
                                                                ${black.code}
                                                        </td>
                                                        <td class="center">
                                                            <a class="btn btn-success"
                                                               href="javascript:void(0);"
                                                               title="<spring:message code="model.blacklist.addBlack" text="addBlack"/>">
                                                                <i class="glyphicon glyphicon-plus-sign icon-white"></i>
                                                            </a>
                                                        </td>
                                                    </tr>
                                                </c:forEach>
                                                </tbody>
                                            </table>
                                        </div>
                                        <nav class="center">
                                            <ul class="pagination">
                                                <li class="disabled"><a href="javascript:void(0);">上一页</a>
                                                </li>
                                                <li class="active"><a href="javascript:void(0);">1</a></li>
                                                <li class="disabled"><a href="javascript:void(0);">下一页</a>
                                                </li>
                                            </ul>
                                        </nav>
                                    </div>
                                </div>
                            </div>--%>

                            <div class="tab-pane" id="blacklist">
                                <div class="navbar-inner">
                                    <div class="navbar-form navbar-left">
                                        <div class="form-group">
                                            <div class="input-group">
                                                <shiro:hasAnyRoles name="SUPER ADMIN">
                                                    <a class="addBlackP btn btn-success" href="#"> <i
                                                            class="glyphicon glyphicon-plus-sign"></i>添加黑名单
                                                    </a>
                                                </shiro:hasAnyRoles>
                                            </div>
                                        </div>
                                    </div>
                                    <c:url value="/json/blackList/showBlack" var="searchActoin">
                                        <c:param name="typeId" value="${typeId }"/>
                                    </c:url>
                                    <form:form onsubmit="return checkcondition();" id="blackForm"
                                               modelAttribute="blackSearchForm" action="${searchActoin}">
                                        <form:hidden path="orderByClause"/>
                                        <form:hidden path="page" value="1"/>
                                        <form:hidden path="size" value="5"/>
                                        <spring:message code="placeholder.start" text="Start"
                                                        var="placeholder_start"/>
                                        <spring:message code="placeholder.to" text="To"
                                                        var="placeholder_to"/>
                                        <spring:message code="placeholder.end" text="End"
                                                        var="placeholder_end"/>
                                        <spring:message code="placeholder.keyword.name" text="Keyword"
                                                        var="placeholder_keyword_name"/>
                                        <spring:message code="placeholder.search" text="Search"
                                                        var="placeholder_search"/>
                                        <div class="navbar-form navbar-right" role="search">
                                            <div class="form-group">
                                                <div class="input-group">
                                                    <form:input class="form-control"
                                                                placeholder="${placeholder_keyword_name}"
                                                                path="key"/>
									                            <span class="input-group-btn">
									                              <button type="submit"
                                                                          class="submitbutton btn btn-info"><i
                                                                          class="glyphicon glyphicon-search"></i>
                                                                  </button>
									                            </span>
                                                </div>
                                            </div>
                                        </div>
                                    </form:form>
                                    <div id="wrapper">
                                    </div>
                                </div>
                            </div>
                            <%--</div>--%>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div><!--/rightbox-content-->
    <%@include file="../../footer.jsp" %>
</div>
<div class="modal fade" id="blackModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
        </div>
    </div>

</div><!--/.fluid-container-->
<div class="modal fade" id="view" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel" aria-hidden="true">

    <div class="modal-dialog">
        <div class="modal-content">
        </div>
    </div>
</div>
<!-- external javascript -->

<script src='<c:url value='/resources/charisma-master/bower_components/bootstrap/dist/js/bootstrap.min.js'/>'></script>

<!-- library for cookie management -->
<script src='<c:url value='/resources/charisma-master/js/jquery.cookie.js '/>'></script>
<!-- calender plugin -->
<script src='<c:url value='/resources/charisma-master/bower_components/moment/min/moment.min.js '/>'></script>
<script src='<c:url value='/resources/charisma-master/bower_components/fullcalendar/dist/fullcalendar.min.js '/>'></script>
<!-- data table plugin -->
<script src='<c:url value='/resources/charisma-master/js/jquery.dataTables.min.js '/>'></script>

<!-- select or dropdown enhancer -->
<script src='<c:url value='/resources/charisma-master/bower_components/chosen/chosen.jquery.min.js '/>'></script>
<!-- plugin for gallery image view -->
<script src='<c:url value='/resources/charisma-master/bower_components/colorbox/jquery.colorbox-min.js '/>'></script>
<!-- notification plugin -->
<script src='<c:url value='/resources/charisma-master/js/jquery.noty.js '/>'></script>
<!-- library for making tables responsive -->
<script src='<c:url value='/resources/charisma-master/bower_components/responsive-tables/responsive-tables.js '/>'></script>
<!-- tour plugin -->
<script src='<c:url value='/resources/charisma-master/bower_components/bootstrap-tour/build/js/bootstrap-tour.min.js '/>'></script>
<!-- star rating plugin -->
<script src='<c:url value='/resources/charisma-master/js/jquery.raty.min.js '/>'></script>
<!-- for iOS style toggle switch -->
<script src='<c:url value='/resources/charisma-master/js/jquery.iphone.toggle.js '/>'></script>
<!-- autogrowing textarea plugin -->
<script src='<c:url value='/resources/charisma-master/js/jquery.autogrow-textarea.js '/>'></script>
<!-- multiple file upload plugin -->
<script src='<c:url value='/resources/charisma-master/js/jquery.uploadify-3.1.min.js '/>'></script>
<!-- history.js for cross-browser state change on ajax -->
<script src='<c:url value='/resources/charisma-master/js/jquery.history.js '/>'></script>
<!-- form.js for form submit on ajax -->
<script src='<c:url value='/resources/charisma-master/bower_components/jquery-validation-1.13.1/lib/jquery.form.js '/>'></script>
<!-- validate.js for form submit on ajax -->
<script src='<c:url value='/resources/charisma-master/bower_components/jquery-validation-1.13.1/dist/jquery.validate.js '/>'></script>
<!-- application script for Charisma demo -->
<script src='<c:url value='/resources/charisma-master/js/charisma.js '/>'></script>
<script src='<c:url value='/resources/charisma-master/bower_components/jquery-tmpl-master/jquery.tmpl.js '/>'></script>
<script src='<c:url value='/resources/charisma-master/bower_components/bootstrap-datepicker-release/js/bootstrap-datepicker.js '/>'></script>
<script src='<c:url value='/resources/charisma-master/bower_components/bootstrap-datepicker-release/js/locales/bootstrap-datepicker.zh-CN.js '/>'></script>
<script src='<c:url value='/resources/js/common/common.js'/>'></script>


<script type="text/x-jquery-tmpl" id="tipTemplate">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4>温馨提示</h4>
            </div>
            <div class="modal-body">
                <div class="box-content">
                    <p> <span class="tip"></span></p>
                </div>
            </div>
            <div class="modal-footer">
                <a href="javascript:void(0);" class="submitBtn btn btn-primary"
                   data-dismiss="modal"><strong><i class="glyphicon glyphicon-share-alt"></i> 确定</strong></a>
                <a href="javascript:void(0);" class="btn btn-primary" data-dismiss="modal"><strong><i
                        class="glyphicon glyphicon-share-alt"></i> 取消</strong></a>
            </div>
        </div>




</script>
<script type="text/html" id="blacklistTemplate">
				                    <div class="table-content">
				                      <table class="table table-striped table-bordered responsive">
				                      <thead>
				                      <tr>
				                          <th id="th_appname" ><spring:message
        code="model.blacklist.appname"/></th>
				                          <th id="th_username" title="username"><spring:message
        code="model.blacklist.username"/></th>
				                          <th id="th_code"><spring:message code="model.blacklist.code"
                                                                           text="Code"/></th>
				                          <%--<th id="th_" title="Count"><spring:message code="model.blacklist.activenum"
                                                                                     text="Count"/></th>--%>
				                           <th title="Actions" class="actions w90"><spring:message code="actions"
                                                                                                   text="Actions"/></th>
				                      </tr>
				                      </thead>
				                      <tbody>
				                        {{if blackpages.page.items.length == 0}}
				                            <tr>
												<td style="display:none">无</td>
												<td colspan="20" class="center">表中数据为空！</td>
											</tr>
				                        {{/if}}
										{{each blackpages.page.items}}
				           				<tr>
				           					<td id="appid"><span style="display:none;">{{= appid}}</span>{{= appName}}</td>
				           					<td>{{= userName}}</td>
				           					<td id="code"><span style="display:none;">{{= code}}</span>{{= code}}</td>
				           					<%--<td >{{= count}}</td>--%>
				           					<td class="center">
				           						{{if type == "black"}}
											    <a class="btn btn-danger setwhite" href="javascript:void(0);" title="<spring:message
        code="model.blacklist.delBlack" text="delBlack"/>" >
				                                <i class="glyphicon glyphicon-remove icon-white"></i>
				                                </a>
				                                {{/if}}
				           						{{if type == "white"}}
				           						<a class="btn btn-success setblack" href="javascript:void(0);" title="<spring:message
        code="model.blacklist.addBlack" text="addBlack"/>" >
				                                <i class="glyphicon glyphicon-plus-sign icon-white"></i>
				                                </a>
				                                {{/if}}
				           					</td>
				           				</tr>
										{{/each}}
				                      </tbody>
			                      </table>
				                    </div>
				                    <nav class="center">
									<ul class="pagination">
										{{if blackpages.page.pageNum == 1}}
											   <li class="disabled"><a href="#">&laquo;</a></li>
											{{else}}
											   <li><a
											   href="<c:url value="/json/blackList/showBlack"/>"><span>&laquo;</span></a>
											   </li>
											   {{/if}}
											{{each(i,value) pages}}
													{{if blackpages.page.pageNum == value }}
												   <li class="active"><a href="#">{{= value}}</a></li>
												   {{else value == 0}}
												   <li><a>...</a></li>
												   {{else}}
												   <li><a
												   href="<c:url value="/json/blackList/showBlack"/>"><span>{{= value}}</span></a>
												   </li>
												   {{/if}}
												   {{/each}}
											{{if blackpages.page.pageNum == blackpages.page.totalPage}}
											   <li class="disabled"><a href="#">&raquo;</a></li>
											   {{else}}
											   <li><a
											   href="<c:url value="/json/blackList/showBlack"/>"><span>&raquo;</span></a>
											   </li>
											   {{/if}}
									</ul>
								</nav>
			                    </div>



</script>
<script type="text/html" id="selectUserAppTemplate">
    <optgroup label="{{= username}}">
        {{each apps}}
        <option value="{{= appid}}">{{= appname}}</option>
        {{/each}}
    </optgroup>
</script>
<script type="text/html" id="addBlackPTmpl">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">×</button>
            <h4>新增黑名单</h4>
        </div>
        <div class="modal-body">
            <div class="box-content">
                <form method="post" id="addForm" name="addForm" action="<c:url value="/json/blackList/add" />"
                      class="form-horizontal">
                    <div class="form-group">
                        <label class="col-sm-3 control-label">应用名称：</label>

                        <div class="col-sm-4">
                            <select id="appid" name="appid" class="form-control"></select>
                            <label id="error_appid"></label>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-3 control-label"><spring:message code="model.blacklist.code"
                                                                              text="code"/>：</label>

                        <div class="col-sm-4">
                            <input class="form-control error" id="code2" name="code">
                            <label id="error_code"></label>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="modal-footer">
            <a href="javascript:void(0);" class="addpermissionbutton btn btn-primary"
               data-dismiss="modal"><strong><i class="glyphicon glyphicon-share-alt"></i> 确定</strong></a>
            <a href="javascript:void(0);" class="btn btn-primary" data-dismiss="modal"><strong><i
                    class="glyphicon glyphicon-share-alt"></i> 取消</strong></a>
        </div>
    </div>
</script>
<script type="text/html" id="deleteWarnTmpl">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">×</button>
            <h4>温馨提示</h4>
        </div>
        <div class="modal-body">
            <div class="box-content">
                <p class="deletetip">是否确定要删除应用</p>
            </div>
        </div>
        <div class="modal-footer">
            <a href="javascript:void(0);" class="deleteButton btn btn-primary" data-dismiss="modal"><strong><i
                    class="glyphicon glyphicon-share-alt"></i> 确定</strong></a>
            <a href="javascript:void(0);" class="btn btn-primary" data-dismiss="modal"><strong><i
                    class="glyphicon glyphicon-share-alt"></i> 取消</strong></a>
        </div>
    </div>
</script>
<script type="text/javascript">
    $(document).on("ready", function () {
        var showList = function (form) {
            var serialized = form.serialize();
            console.log(serialized);
            $.ajax({
                type: "POST",
                url: form.attr("action"),
                async: false,
                data: serialized,
                dataType: "json",
                success: function (result) {
                    console.log(result);
                    var wrapper = form.siblings("#wrapper");
                    wrapper.empty();
                    debugger;
                    $("#blacklistTemplate").tmpl(result).appendTo(wrapper);
                    var searchForm = result.searchForm;
                    form.find("#page").val(searchForm.page);
                    /*$("#blacktab").delegate('ul.pagination>li>a',"click",function (e) {
                     e.preventDefault();
                     var pageNum = $(this).find("span").text();
                     $("#blackForm #page").val(pageNum);
                     showBlack();
                     });*/
                    wrapper.find('ul.pagination>li:not(.disabled):not(.active)>a').on("click", function (e) {
                        e.preventDefault();
                        var pageNum = $(this).find("span").text();
                        if (isNaN(pageNum)) {
                            if (pageNum == "下一页") {
                                pageNum = Number($("#page").val()) + 1;
                            } else {
                                pageNum = Number($("#page").val()) - 1;
                            }
                        }
                        form.find("#page").val(pageNum);
                        showList(form);
                    });
                    var white = wrapper.find(".setwhite");
                    var black = wrapper.find(".setblack");
                    if (white.length > 0) {
                        white.on("click", function (e) {
                            var appid = $(this).parents("tr").find("#appid span").text();
                            var code = $(this).parents("tr").find("#code span").text();
                            $("#tipTemplate").tmpl().replaceAll("#blackModal .modal-content");
                            $("#blackModal .modal-content .tip").text("您确定将该账户从黑名单中删除！");
                            $("#blackModal").modal("show");
                            $(".modal .submitBtn").one("click", function (e) {
                                e.preventDefault();
                                $.ajax({
                                    type: "POST",
                                    url: '<c:url value="/json/blackList/setWhite" />',
                                    async: false,
                                    data: {appid: appid, code: code},
                                    dataType: "json",
                                    success: function (result) {
                                        if (result.setWhiteStatus == 1) {
                                            showList(form);
                                        }
                                    }
                                });
                            });
                        });

                    } else(black.length > 0)
                    {
                        black.on("click", function (e) {
                            var appid = $(this).parents("tr").find("#appid span").text();
                            var code = $(this).parents("tr").find("#code span").text();
                            $("#tipTemplate").tmpl().replaceAll("#blackModal .modal-content");
                            $("#blackModal .modal-content .tip").text("您确定将该账户加入黑名单！");
                            $("#blackModal").modal("show");
                            $(".modal .submitBtn").one("click", function (e) {
                                e.preventDefault();
                                $.ajax({
                                    type: "POST",
                                    url: '<c:url value="/json/blackList/setBlack" />',
                                    async: false,
                                    data: {appid: appid, code: code},
                                    dataType: "json",
                                    success: function (result) {
                                        if (result.setBlackStatus == 1) {
                                            showList(form);
                                        }
                                    }
                                });
                            });
                        });
                    }
                    $(".mynavbarbox").height(window.document.body.scrollHeight - $(".mynavbar").height() - 2);
                }
            });
        }
        $("form").on("submit", function (e) {
            e.preventDefault();
            showList($(this));
        });
        $("ul#myTab>li>a").on("click", function (e) {
            if (!$(this).hasClass("active")) {
                var href = $(this).attr("href");
                showList($(href + " form"));
            }
        });
        showList($("#blacklist form"));
        /*$("#blacktab").on("click",function(e){
         showBlack();
         });*/
        /*$(".submitbutton").on("click",function(e){
         e.preventDefault();
         showBlack();
         });*/

        /*$('.input-daterange').datepicker({
         format: "yyyy-mm-dd",
         todayBtn: "linked",
         language: "zh-CN",
         autoclose: true,
         todayHighlight: true
         });*/

        $('.addBlackP').on('click', function (e) {
            $("#addBlackPTmpl").tmpl().replaceAll("#blackModal .modal-content");
            $("#blackModal #appid").empty();
            $("#blackModal #appid").next().empty();
            $("#code2").val("");
            $("#code2").next().empty();
            $.ajax({
                type: "POST",
                url: "<c:url value="/json/app/viewList" />",
                data: {},
                success: function (result) {
                    var data = result.appResources;
                    if (data != null && data.length > 0) {
                        $("#selectUserAppTemplate").tmpl(data).appendTo($("#blackModal #appid"));
                        /*var html = [];
                         for (var i = 0; i < data.length; i++) {
                         html.push('<option value=' + data[i].appid + '>' + data[i].appname + '</option>');
                         }
                         $("#blackModal #appid").append(html.join(''));*/
                    } else {
                        $("#blackModal #appid").append("<option value=''>暂无应用</option>");
                    }
                    $("#blackModal").modal("show");
                    $('#addForm').validate({
                        submitHandler: function (form) {
                            $(form).ajaxSubmit({
                                dataType: "json",
                                /*data: {appid: id},*/
                                type: "post",
                                success: function (data, status, xhr) {
                                    console.log(status);
                                    console.log(xhr);
                                    var addStatus = data.status;
                                    $('#view').modal("hide");
                                    if (addStatus == 1) {
                                        noty({
                                            text: "添加成功！",
                                            layout: "top",
                                            type: "success",
                                            timeout: 1000,
                                            onClosed: function () {
                                                showList($("#blacklist form"));
                                            }
                                        });

                                    } else if (addStatus == 0) {
                                        noty({
                                            text: "添加失败！",
                                            layout: "top",
                                            type: "error",
                                            timeout: 1000
                                        });
                                    }
                                }
                            });
                            return false;
                        },
                        errorPlacement: function (error, element) {
                            $("#error_" + $(element).attr("name")).empty();
                            error.appendTo($("#error_" + $(element).attr("name")));
                        },
                        rules: {
                            appid: {
                                required: true
                            },
                            code: {
                                required: true,
                                remote: {
                                    url: '<c:url value="/json/blackList/checkcode"/>',
                                    type: 'post',
                                    dataType: 'json',
                                    data: {
                                        appid: function () {
                                            return $("[name=appid]").val();
                                        },
                                        code: function () {
                                            return $("[name=code]").val();
                                        }
                                    }
                                }
                            }
                        },
                        messages: {
                            appid: {
                                required: "必填项！"
                            },
                            code: {
                                required: "必填项！",
                                remote: "该应用与设备特征码不匹配或者已经加入黑名单！请重新输入！"
                            }
                        },
                        success: function (label) {
                            if (label.prev()) {
                                label.prev().remove();
                            }
                            label.text("${validate_message_ok}").addClass("valid");
                            label.removeClass("error");
                            label.html("有效");
                        }
                    });
                    $(".addpermissionbutton").on('click', function (e) {
                        if ($("#addForm").valid()) {
                            $("#addForm").submit();
                        } else {
                            return false;
                        }
                    });
                }
            });
        });
        $('.deleteBlackP').on('click', function (e) {
            var id = $(this).parents("tr").attr("id");
            var code = $(this).parent().prev().text();
            $("#deleteWarnTmpl").tmpl().replaceAll("#blackModal .modal-content");
            $('#blackModal').modal('show');
            $('.deleteButton').on('click', function (e) {
                $.ajax({
                    type: "POST",
                    url: "<c:url value="/json/blackList/deleteBlack" />",
                    data: {
                        appid: id,
                        code: code
                    },
                    success: function (result) {
                        window.location = "<c:url value="/blacklist/manage" />";
                    }
                });
            });
        });
    });
</script>
</body>
</html>
